<template>
    <dv-border-box7 :color="['#0D3568', '#49ACD6']" backgroundColor="" style="margin-top: 15px;">
        <div class="platewrapper">
            <headline title="车场实时动态" />
            <div class="cont-wrapper">
                <a-card style="width: 100%; background-color: rgba(0, 0, 0, .5); margin-bottom: 10px;" :bodyStyle="{ padding: '0px' }">
                    <div class="card_content">
                        <div class="cont_pic">
                            <img src="https://mat.deliyun.cn/w/bi/images/default.png" />
                        </div>
                        <div class="cont_desc">
                            <div style="display: flex; justify-content: space-between; align-items: center;">
                                <span style="color:#2CCC44; font-size: 18px; font-weight: 500;">粤B562BY</span>
                                <span style="color: #fff;">204-03-15- 11:30: 29</span>
                            </div>
                            <div style="color: #0282FD;">智慧物业项目1</div>
                        </div>
                    </div>
                </a-card>
                <dv-scroll-board :config="config" style="width:100%; height: 165px" />
            </div>
        </div>
    </dv-border-box7>
</template>

<script setup lang="ts">
const config = reactive({
    header: ['车牌号', '项目名称',  '经常时间'],
    data: [
        ['粤A98226', '智慧物业项目1', '204-03-15- 11:30: 29'],
        ['粤B00886', '智慧物业项目2', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目3', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目4', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目5', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目6', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目7', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目8', '204-03-15- 11:30: 29'],
        ['粤R9J5981', '智慧物业项目9', '204-03-15- 11:30: 29'],
        ['琼456809', '智慧物业项目10', '204-03-15- 11:30: 29'],
    ],
    index: false,
    columnWidth: [120],
    align: ['center'],
    headerBGC: 'rgba(2, 50, 80, 0.6)', // 表头背景色
    oddRowBGC: 'rgba(193,231,255,.1)',
    evenRowBGC: 'rgba(193,231,255,.2)',
});
</script>

<style lang="less" scoped>
.card_content {
    padding: 10px;
    display: flex;
    align-items: center;
    .cont_pic {
        width: 130px;
        height: 80px;
        overflow: hidden;
        border-radius: 6px;
        img {
            width: 130px;
            height: 80px;
        }
    }
    .cont_desc {
        flex: 1;
        margin-left: 10px;
        div { line-height: 2; }
    }
}
</style>